/// describe
///
/// created by hujintao
/// created at 2021/5/19
//
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutterappdriver/network/music_api.dart';
import 'package:flutterappdriver/utils/screen.dart';
import 'package:flutterappdriver/widget/favorite_play_list_icon.dart';
import 'package:flutterappdriver/widget/loading_container.dart';
import 'package:flutterappdriver/widget/song_item_title.dart';
class PlayListDetail extends StatefulWidget {
  Map playlist;
  final String heroTag;
  PlayListDetail({Key? key, required this.playlist, this.heroTag = ""}) : super(key: key);

  @override
  _PlayListDetailState createState() => _PlayListDetailState();
}

class _PlayListDetailState extends State<PlayListDetail> {
  /// 记录Scaffold状态
  /// 针对context中没有这个Scafold的时候会报错的情况。
  ///  static final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

  double _appBarHeight = 0;
  List _songs = [];
  ScrollController _controller = ScrollController();

  @override
  void initState() {
    // appBar和图片宽高比相同
    _appBarHeight = Screen.width * 4 / 6;
    _controller = ScrollController();

    _getPlayListSongs();
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
  }

  _getPlayListSongs() async {
    MusicApi.getPlayListDetail(widget.playlist!['id'] as int).then((list) {
      if (mounted) {
        setState(() {
          _songs = list;
        });
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
        onWillPop: _beforePop,
        child: Scaffold(
          body: LoadingContainer(
            isLoading: this._songs.length == 0,
            cover: true,
            child: CustomScrollView(
              slivers: <Widget>[
                _buildAppBar(),
                SliverList(
                  delegate: SliverChildBuilderDelegate(
                        (BuildContext context, int index) {
                      return SongItemTile(this._songs, index);
                    },
                    childCount: _songs.length,
                  ),
                ),
              ],
              controller: _controller,
            ),
          ),
        ));
  }

  Widget _buildAppBar() {
    return SliverAppBar(
      expandedHeight: _appBarHeight,
      pinned: true,
      floating: false,
      snap: false,
      actions: [
        FavoritePlayListIcon(widget.playlist)
      ],
      flexibleSpace: FlexibleSpaceBar(
        title: Text(
          "${widget.playlist!['name']}",
          maxLines: 1,
          overflow: TextOverflow.ellipsis,
          style: TextStyle(fontSize: 16.0, color: Colors.white),
        ),
        centerTitle: false,
        titlePadding: EdgeInsetsDirectional.only(start: 46.0, bottom: 16.0),
        background: Stack(
          fit: StackFit.expand,
          children: <Widget>[
            Hero(
                tag: widget.heroTag,
                child: CachedNetworkImage(
                    imageUrl: "${widget.playlist!['coverImgUrl']}?param=600y400",
                    fit: BoxFit.cover,
                    placeholder: (context, url) => Image.asset(
                      'images/placeholder_play_list.jpg',
                      fit: BoxFit.cover,
                    ),
                    height: _appBarHeight)),
            // This gradient ensures that the toolbar icons are distinct
            // against the background image.
            const DecoratedBox(
              decoration: BoxDecoration(
                gradient: LinearGradient(
                  begin: Alignment(0.0, -1.0),
                  end: Alignment(0.0, -0.4),
                  colors: <Color>[Color(0x60000000), Color(0x00000000)],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Future<bool> _beforePop() async {
    // 在页面退出的时候回到顶部，不然Hero动画之前的图片会空白。
    _controller.jumpTo(0);
    return true;
  }
}
